import { Component } from '@angular/core';
import { NzTableFilterFn, NzTableFilterList, NzTableSortFn, NzTableSortOrder } from 'ng-zorro-antd/table';
import { Student} from '../student';
// import {StudentService} from '../students.service';
import {HttpService} from '../http.service';
import {ActivatedRoute, Router} from '@angular/router';


interface ColumnItem {
  name: string;
  sortOrder?: NzTableSortOrder;
  sortFn?: NzTableSortFn;
  listOfFilter?: NzTableFilterList;
  filterFn?: NzTableFilterFn;
  filterMultiple?: boolean;
  sortDirections?: NzTableSortOrder[];
}

@Component({
  // tslint:disable-next-line:component-selector
  selector: 'student',
  templateUrl: './student.component.html'
})
export class StudentComponent {

  listOfColumns: ColumnItem[] = [
    {
      name: '学号',
      sortOrder: 'ascend',
      sortFn: (a: Student, b: Student) => a.stuid - b.stuid,
      sortDirections: ['ascend', null]
    },
    {
      name: '姓名',
    },
    {
      name: '出生年月',
      sortOrder: null,
      sortFn: (a: Student, b: Student) => a.birthday.localeCompare(b.birthday),
      filterMultiple: false,
      listOfFilter: [
        { text: '1996', value: '1996' },
        { text: '1997', value: '1997' },
        { text: '1998', value: '1998' },
        { text: '1999', value: '1999' },
        { text: '2000', value: '2000' },
      ],
      filterFn: (birthday: string, item: Student) => item.birthday.indexOf(birthday) !== -1
    },
    {
      name: '性别',
      filterMultiple: false,
      listOfFilter: [
        { text: '男', value: '男' },
        { text: '女', value: '女' }
      ],
      filterFn: (sex: string, item: Student) => item.sex.indexOf(sex) !== -1
    },
    {
      name: '专业',
      filterMultiple: false,
      listOfFilter: [
        { text: '信息管理与信息系统', value: '信息管理与信息系统' },
        { text: '市场营销学', value: '市场营销学' },
        { text: '国际经济与贸易', value: '国际经济与贸易' },
        { text: '金融学', value: '金融学' },
        { text: '会计', value: '会计' },
      ],
      filterFn: (major: string, item: Student) => item.major.indexOf(major) !== -1
    },
    {
      name: '班级',
      filterMultiple: false,
      listOfFilter: [
        { text: '信息管理与信息系统1501', value: '信息管理与信息系统1501' },
        { text: '信息管理与信息系统1502', value: '信息管理与信息系统1502' },
        { text: '市场营销学1501', value: '市场营销学1501' },
        { text: '市场营销学1502', value: '市场营销学1502' },
        { text: '国际经济与贸易1501', value: '国际经济与贸易1501' },
        { text: '国际经济与贸易1502', value: '国际经济与贸易1502' },
        { text: '金融学1501', value: '金融学1501' },
        { text: '金融学1502', value: '金融学1502' },
        { text: '会计学1501', value: '会计学1501' },
        { text: '会计学1502', value: '会计学1502' },
        { text: '信息管理与信息系统1601', value: '信息管理与信息系统1601' },
        { text: '信息管理与信息系统1602', value: '信息管理与信息系统1602' },
        { text: '市场营销学1601', value: '市场营销学1601' },
        { text: '市场营销学1602', value: '市场营销学1602' },
        { text: '国际经济与贸易1601', value: '国际经济与贸易1601' },
        { text: '国际经济与贸易1602', value: '国际经济与贸易1602' },
        { text: '金融学1601', value: '金融学1601' },
        { text: '金融学1602', value: '金融学1602' },
        { text: '会计学1601', value: '会计学1601' },
        { text: '会计学1602', value: '会计学1602' },
        { text: '信息管理与信息系统1701', value: '信息管理与信息系统1701' },
        { text: '信息管理与信息系统1702', value: '信息管理与信息系统1702' },
        { text: '市场营销学1701', value: '市场营销学1701' },
        { text: '市场营销学1702', value: '市场营销学1702' },
        { text: '国际经济与贸易1701', value: '国际经济与贸易1701' },
        { text: '国际经济与贸易1702', value: '国际经济与贸易1702' },
        { text: '金融学1701', value: '金融学1701' },
        { text: '金融学1702', value: '金融学1702' },
        { text: '会计学1701', value: '会计学1701' },
        { text: '会计学1702', value: '会计学1702' },
        { text: '信息管理与信息系统1801', value: '信息管理与信息系统1801' },
        { text: '信息管理与信息系统1802', value: '信息管理与信息系统1802' },
        { text: '市场营销学1801', value: '市场营销学1801' },
        { text: '市场营销学1802', value: '市场营销学1802' },
        { text: '国际经济与贸易1801', value: '国际经济与贸易1801' },
        { text: '国际经济与贸易1802', value: '国际经济与贸易1802' },
        { text: '金融学1801', value: '金融学1801' },
        { text: '金融学1802', value: '金融学1802' },
        { text: '会计学1801', value: '会计学1801' },
        { text: '会计学1802', value: '会计学1802' },
        { text: '信息管理与信息系统1901', value: '信息管理与信息系统1901' },
        { text: '信息管理与信息系统1902', value: '信息管理与信息系统1902' },
        { text: '市场营销学1901', value: '市场营销学1901' },
        { text: '市场营销学1902', value: '市场营销学1902' },
        { text: '国际经济与贸易1901', value: '国际经济与贸易1901' },
        { text: '国际经济与贸易1902', value: '国际经济与贸易1902' },
        { text: '金融学1901', value: '金融学1901' },
        { text: '金融学1902', value: '金融学1902' },
        { text: '会计学1901', value: '会计学1901' },
        { text: '会计学1902', value: '会计学1902' },
      ],
      filterFn: (clas: string, item: Student) => item.class.indexOf(clas) !== -1
    },
    {
      name: '籍贯',
      filterMultiple: false,
      listOfFilter: [
        { text: '安徽', value: '安徽' },
        { text: '北京', value: '北京' },
        { text: '重庆', value: '重庆' },
        { text: '福建', value: '福建' },
        { text: '甘肃', value: '甘肃' },
        { text: '广东', value: '广东' },
        { text: '广西', value: '广西' },
        { text: '贵州', value: '贵州' },
        { text: '海南', value: '海南' },
        { text: '河北', value: '河北' },
        { text: '河南', value: '河南' },
        { text: '黑龙江', value: '黑龙江' },
        { text: '湖北', value: '湖北' },
        { text: '湖南', value: '湖南' },
        { text: '吉林', value: '吉林' },
        { text: '江苏', value: '江苏' },
        { text: '江西', value: '江西' },
        { text: '辽宁', value: '辽宁' },
        { text: '内蒙', value: '内幕' },
        { text: '宁夏', value: '宁夏' },
        { text: '青海', value: '青海' },
        { text: '山东', value: '山东' },
        { text: '山西', value: '山西' },
        { text: '陕西', value: '陕西' },
        { text: '上海', value: '上海' },
        { text: '四川', value: '四川' },
        { text: '天津', value: '天津' },
        { text: '西藏', value: '西藏' },
        { text: '新疆', value: '新疆' },
        { text: '云南', value: '云南' },
        { text: '浙江', value: '浙江' },
        { text: '香港', value: '香港' },
        { text: '澳门', value: '澳门' },
        { text: '台湾', value: '台湾' },
      ],
      filterFn: (native: string, item: Student) => item.native_place.indexOf(native) !== -1
    },
    {
      name: '入学年份',
      sortOrder: null,
      sortFn: (a: Student, b: Student) => a.time_of_enrollment.localeCompare(b.time_of_enrollment),
      filterMultiple: false,
      listOfFilter: [
        { text: '2015', value: '2015' },
        { text: '2016', value: '2016' },
        { text: '2017', value: '2017' },
        { text: '2018', value: '2018' },
        { text: '2019', value: '2019' },
      ],
      filterFn: (time: string, item: Student) => item.time_of_enrollment.indexOf(time) !== -1
    },
  ];

  constructor( private studentService: HttpService) { }
  students: Student [] = [];
  display: Student[] = [];
  pageindex = 1;
  pagesize = 10;
  total = 1000;
  loading = true;

  changePageIndex(pageindex) {
    this.pageindex = pageindex ;
    this.display = this.students.slice(pageindex * 10 - 10, pageindex * 10);
  }

  getStudents(): void {
    this.loading = true;
    this.studentService.getStudents().subscribe(
      (res) => {
        res.data.forEach(row => {
          this.students = [...this.students];
          this.students.push( {
              native_place: row.native_place,
              time_of_enrollment: row.time_of_enrollment,
              birthday : row.birthday,
              class : row.class,
              major : row.major,
              name : row.name,
              sex : row.sex,
              stuid : row.stuid
            }
          );
        });
        this.display = this.students.slice( 0 , 1000);
        this.loading = false;
      });
  }
  // tslint:disable-next-line:use-lifecycle-interface
  ngOnInit(): void {
    this.getStudents();
  }
}


